<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=yes">

    <meta content="telephone=yes,email=yes" name="format-detection">
    <!--//自动识别电话号码和邮箱-->

    <meta content="yes" name="apple-mobile-web-app-capable">
    <!--//苹果手机：会删除默认的工具栏和菜单栏，网站开启对web app程序的支持-->
    <meta name="apple-mobile-web-app-status-bar-style" content="default"/>
    <!--//苹果手机：在web app应用下状态条（屏幕顶部条）的颜色,默认值为default（白色），可以定为black（黑色）和black-translucent（灰色半透明）。-->
    <meta name="apple-touch-fullscreen" content="yes"/>
    <!--//苹果手机：如果把一个web app添加到了主屏幕中，那么从主屏幕中打开这个web app则全屏显示-->
    <link rel="apple-touch-icon" href="images/HTML5_Badge_64.png"/>
    <!--//苹果手机：将应用添加到手机主屏幕，会有一个icon可以直接进入-->
    <title>有收入</title>
    <meta name="description" content="">
    <meta name="keywords" content="">
    <!--初始化样式-->
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/UploadImg.css">
    <!--共用样式-->
    <link rel="stylesheet" href="css/common.css">
    <!--整个网站的局部样式-->
    <link rel="stylesheet" href="css/style.css">
    <!--适配样式-->
    <link rel="stylesheet" href="css/styleMedia.css">
    <style>
        html, body {
            position: relative;
            overflow-x: hidden;
        }
    </style>


</head>
<body style="background-color: #f4f9fd;">

<!--header begin-->
<header>
    <div id="flexHeader">
        <div class="div1 mui-action-back"><a><img src="images/icon_arrow_left.png"></a></div>
        <div class="div2">操作任务</div>
        <div class="div3"></div>
    </div>
</header>
<!--header end-->

<!--The goods are compared to the three begin-->
<form action="" method="post" id="frombyBrowse" >
<article class="goods-compared-three height-padding">
    <section>浏览店铺</section>
    <section>
        <p>1.根据商品主图、价格、名称等找到目标商品，点击“进入店铺”按钮</p>
        <p>2.一次点开店铺里任意2个商品，分别截图，商品浏览需要慢慢滑动到详情底部</p>
        <p>3.返回到目标商品详情页，从头到尾慢慢浏览，停留至少3分钟，并在页面头部的底部时分别截图</p>
    </section>
    <section>
        <ul>
            <li>
                <p>店铺商品1&nbsp;&nbsp;&nbsp;&nbsp;</p>
                <p>
                    <div class="fileBtn">
                <p>+</p>
                <input id="fileBtn" name="files" type="file" onchange="upload();" accept="image/*" capture="camera" multiple="multiple"/>
                <!--单张图片容器-->
                <img src="" id="img"/>
                </div>
                </p>
            </li>
            <li>
                <p>店铺商品2&nbsp;&nbsp;&nbsp;&nbsp;</p>
                <p>
                    <div class="fileBtn">
                <p>+</p>
                <input id="fileBtn1" name="files" type="file" onchange="upload1();" accept="image/*" capture="camera" multiple="multiple"/>
                <!--单张图片容器-->
                <img src="" id="img1"/>
                </div>
                </p>
            </li>
            <li>
                <p>目标商品头部</p>
                <p>
                    <div class="fileBtn">
                <p>+</p>
                <input id="fileBtn2" name="files" type="file" onchange="upload2();" accept="image/*" capture="camera" multiple="multiple"/>
                <!--单张图片容器-->
                <img src="" id="img2"/>
                </div>
                </p>
            </li>
            <li>
                <p>目标商品头部</p>
                <p>
                    <div class="fileBtn">
                <p>+</p>
                <input id="fileBtn3" name="files" type="file" onchange="upload3();" accept="image/*" capture="camera" multiple="multiple"/>
                <!--单张图片容器-->
                <img src="" id="img3"/>
                </div>
                </p>
            </li>
        </ul>
        <!--click update img-->
        <aside>
            <a id="summitButofBrowse">选图后点击这里上传</a>
        </aside>
    </section>
</article>
</form>
<!--The goods are compared to the three end-->

<!--The goods are compared to the three begin-->
<form action="" method="post" id="frombyPayPic" >
<article class="goods-compared-three">
    <section>聊天下单支付</section>
    <section>
        <p>1.点击“联系客服”和商家客服至少进行4个问题的互动，完成后截一张图</p>
        <p>2.把商品加入购物车，确认件数、颜色尺寸和留言要求，下单付款</p>
        <p>3.付款完成后，点击进入订单详情页面，截一张图</p>
    </section>
    <section>
        <ul>
            <li>
                <p>聊天页面&nbsp;&nbsp;&nbsp;&nbsp;</p>
                <p>
                    <div class="fileBtn">
                <p>+</p>
                <input id="fileBtn4" name="files" type="file" onchange="upload4();" accept="image/*" capture="camera" multiple="multiple"/>
                <!--单张图片容器-->
                <img src="" id="img4"/>
                </div>
                </p>
            </li>
            <li>
                <p>付款页面&nbsp;&nbsp;&nbsp;&nbsp;</p>
                <p>
                    <div class="fileBtn">
                <p>+</p>
                <input id="fileBtn5" name="files" type="file" onchange="upload5();" accept="image/*" capture="camera" multiple="multiple"/>
                <!--单张图片容器-->
                <img src="" id="img5"/>
                </div>
                </p>
            </li>
        </ul>
        <!--click update img-->
        <aside>
            <a id="summitButofPayPic">选图后点击这里上传</a>
        </aside>
    </section>
</article>
</form>
<!--The goods are compared to the three end-->


<!--Fill in the actual amount paid. begin -->
<article class="next-step fill-in-the-actual-amount-paid">
    <section class="fill-in-the-actual-amount-paid-title">
        <p>填写实付金额</p>
        <div>
            <aside>
                <label>金额</label>
                <input type="text" value="" placeholder="请您输入实际付款金额" id="money">
            </aside>
            <span>应垫付金参考：25（请按实际垫付金额填写）</span>
        </div>
    </section>
</article>
<!--Fill in the actual amount paid. end-->


<!--Fill in the actual amount paid. begin -->
<article class="next-step fill-in-the-actual-amount-paid">
    <section class="fill-in-the-actual-amount-paid-title">
        <p>填写淘宝订单编号</p>
        <div>
            <aside>
                <label>订单编号</label>
                <input type="text" value="" placeholder="请你输入淘宝订单编号" id="orderNum">
            </aside>
        </div>
    </section>
    <section id="UpGo">
        <aside>
            <a id="asummitBut">提交任务</a>
        </aside>
    </section>
</article>
<!--Fill in the actual amount paid. end-->




<!--js-->
<script src="js/jquery-1.12.3.min.js"></script>
<script src="js/UploadImg.js"></script>
<script src="js/mui.min.js"></script>
<script src="js/config.js"></script>

<script>
	var type = 0;
	$(document).ready(function(){
		mui.plusReady(function(){
			$.ajax({
				url:$CONFIG.baseUrl+"/api/order/getOrderById",
				type: 'post',
				data:{orderId:sessionStorage.getItem("havepandingId")},
				beforeSend:function(x){
					x.setRequestHeader("Authorization",plus.storage.getItem('token'));
				},
				success: function(data){
					console.log(JSON.stringify(data))
					if(data.data.shopGoodsPic1 != null&&data.data.shopGoodsPic1 != "" && data.data.shopGoodsPic2 != null&&data.data.shopGoodsPic2!="" && data.data.targetGoodsHeaderPic!=null && data.data.targetGoodsHeaderPic != "" && data.data.targetGoodsFooterPic!=null && data.data.targetGoodsFooterPic!=""){
						$("#summitButofBrowse").hide();
						type +=1;
						console.log(type)
					}
					if(data.data.chatPic != null&&data.data.chatPic != "" && data.data.payPic != null&&data.data.payPic!=""){
						$("#summitButofPayPic").hide();
						type +=1;
						console.log(type)
					}
					if(type != 2){
						$("#UpGo").attr("disabled","true").css("background-color","#D3D3D3");
						
					}
				},
				errror: function(error){
					console.log('error')
				}
			})
		})
	})

	$("#summitButofBrowse").click(function(){
		ajaxfun("frombyBrowse","/api/order/browseShopPic");
	})
	
	$("#summitButofPayPic").click(function(){
		ajaxfun("frombyPayPic","/api/order/chatAndPayPic");
	})
	
	function ajaxfun(fromid,appendurl){
		var form = document.getElementById(fromid);
		var formdata = new FormData(form);
		formdata.append("orderId",sessionStorage.getItem("havepandingId"));
		console.log(sessionStorage.getItem("havepandingId"))
		$.ajax({
			url:$CONFIG.baseUrl+appendurl,
			type: 'post',
			data: formdata,
			contentType:false,
			processData:false,
			beforeSend:function(x){
				x.setRequestHeader("Authorization",plus.storage.getItem('token'));
			},
			success: function(data){
				console.log("OK")
				plus.nativeUI.toast(data.msg)
				location.reload();
			},
			errror: function(error){
				console.log('error')
			}
		})
	}
	
	$("#asummitBut").click(function(){
		if(type != 2){
			
		}else{
			if($("#money").val() == "" || $("#money").val() == null){
				alert("请输入金额")
			}else if($("#orderNum").val() == "" || $("#orderNum").val() == null){
				alert("请输入您的订单编号")
			}else{
				$.ajax({
					url:$CONFIG.baseUrl+"/api/order/changeStatusTwo",
					type: 'post',
					data: {
						"orderId":sessionStorage.getItem("havepandingId"),
						"orderNum":$("#orderNum").val(),
						"money":$("#money").val(),
					},
					beforeSend:function(x){
						x.setRequestHeader("Authorization",plus.storage.getItem('token'));
					},
					success: function(data){
						plus.nativeUI.toast(data.msg)
						location.replace("alreadyConnectedTask.html")
					},
					errror: function(error){
						console.log('error')
					}
				})
			}
		}
	})
</script>
</script>



</body>
</html>